{extend name="public/base"}

{block name="title"}就行天下-个人中心{/block}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/home/css/index.css" />
{/block}


{block name="main"}
<div class="pageControl indent bg-f7">
    <div class="main-top"></div>
    <div class="msui_nav msui_navTop">
        <a class="msui_navTop-back" href="javascript:history.back();"><i class="micon-back"></i></a>
        <h1 class="msui_navTop-title">订单详情</h1>
        <a href="" class="msui_navTop-right msui_navTop-cnav"><i class="micon-cnav"></i></a>
    </div>
    <div class="weui-cell">
        <div class="weui-cell__bd">
            <!--订单状态-->
            <p class="fs06 cl-c40">{$data.status_text}</p>
            <p class="fs06 cl-9999">订单号: <span>{$data.order_sn}</span></p>
            <p class="fs06 cl-9999">下单时间: <span>{$data.create_time|date="Y-m-d H:i:s", ###}</span></p>
        </div>
    </div>
    <div class="weui-cells">
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p class="fs06">服务方式: <span>{$data.consignment_type}</span></p>
            </div>
        </div>
    </div>
    <div class="weui-cells">
        <div class="weui-cell">
            <div class="weui-cell__hd addressImg">
                <img src="__STATIC__/home/images/address.png" alt="">
            </div>
            <div class="weui-cell__bd">
                <p class="fs06"><span>{$data.consignee} </span> <span>{$data.mobile}</span></p>
                <p class="fs06 cl-9999"><span>{$data.address}</span></p>
            </div>
        </div>
    </div>
    <div class="weui-cells">
        <div class="weui-cell">
            {gt name="data.shop_id" value="0"}
                <div class="weui-cell__hd indentImg">
                    <img src="{$data.shop_logo}" alt="">
                </div>
                <div class="weui-cell__bd">
                    <p class="fs07">{$data.shop_name}</p>
                    <div class="my-flex1">
                        <p class="xx">
                            <!--满星星加class为 active-->
                            <span {gt name="data.shop_level" value="0"} class="active" {/gt}></span>
                            <span {gt name="data.shop_level" value="1"} class="active" {/gt}></span>
                            <span {gt name="data.shop_level" value="2"} class="active" {/gt}></span>
                            <span {gt name="data.shop_level" value="3"} class="active" {/gt}></span>
                            <span {gt name="data.shop_level" value="4"} class="active" {/gt}></span>
                        </p>
                        <span class="fs06 exclusive-count">{$data.shop_level}分</span>
                    </div>
                </div>
            {else /}
                <div class="weui-cell__bd">
                    <p class="fs07">等待接单中</p>
                    <div class="my-flex1">
                        {$data.create_time|date="Y-m-d H:i:s", ###}
                    </div>
                </div>
            {/gt}
        </div>
        {empty name="data.products"}
            <div class="weui-cell confirmOrder">
                <div class="weui-cell__hd">
                    <img src="__STATIC__/home/images/product3.png" alt="">
                </div>
                <div class="weui-cell__bd ">
                    <p class="fs06 listFont">{$data.msg}</p>
                </div>
            </div>
        {else /}
            {volist name="data.products" id="vo"}
                <div class="weui-cell confirmOrder">
                    <div class="weui-cell__hd">
                        <img src="{$vo.image}" alt="">
                    </div>
                    <div class="weui-cell__bd ">
                        <p class="fs06 listFont">{$vo.name}</p>
                    </div>
                    <div class="weui-cell__ft fs06">
                        <p>￥{$vo.price}</p>
                        <p>x{$vo.num}</p>
                    </div>
                </div>
            {/volist}
        {/empty}
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <span class="fs065">商品金额</span>
            </div>
            <div class="weui-cell__ft">
                <span class="fs065 cl-9999">￥{$data.price}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <span class="fs065">合价</span>
            </div>
            <div class="weui-cell__ft">
                <span class="fs065 cl-c40">￥{$data.price}</span>
            </div>
        </div>
    </div>
    <div class="indent-detail-btn weui-cell">
        <div class="weui-cell__bd"></div>
        <div class="weui-cell__ft">
            {if condition="($data.status == 1 && $data.type == 2) OR ($data.status == 3 && $data.type == 1)"}
                <a href="{:url('pay')}?model=order&id={$data.id}" class="indent-btn-c40">立即支付</a>
            {/if}
            {in name="data.status" value="1, 2, 3"}
                <a href="javascript:;" class="indent-btn-999 cancel-order" data-order-id="{$data.id}">取消订单</a>
            {/in}
            {in name="data.status" value="3"}
                <a href="javascript:;" class="indent-btn-999 back-merchant" data-order-id="{$data.id}">退回商家</a>
            {/in}
            {gt name="data.shop_id" value="0"}
                {in name="data.status" value="4"}
                    <a href="javascript:;" class="indent-btn-b20 confirm-receipt" data-order-id="{$data.id}">确认收货</a>
                {/in}
            {else /}
                {in name="data.status" value="5"}
                    <a href="javascript:;" class="indent-btn-b20 confirm-receipt" data-order-id="{$data.id}">确认收货</a>
                {/in}
            {/gt}
            {notempty name="data.express_sn"}
                <a href="javascript:;" class="indent-btn-999" data-order-id="{$data.id}">查看物流</a>
            {/notempty}
            {in name="data.status" value="6"}
                {eq name="data.comment_status" value="1"}
                    <a href="{:url('comment/index', ['id' => $data['id']])}" class="indent-btn-b20">评价</a>
                {/eq}
                <!--{eq name="data.after_status" value="1"}-->
                    <!--<a href="" class="indent-btn-b20">退货</a>-->
                <!--{/eq}-->
            {/in}
            <!--<a href="" class="indent-btn-999 cancellationOrder">取消订单</a>-->
            <!--<a href="" class="indent-btn-f0a">订单跟踪</a>-->
            <!--<a href="" class="indent-btn-f0a">确认订单</a>-->
            <!--<a href="" class="indent-btn-c40">付款</a>-->
        </div>
    </div>
</div>
{/block}

{block name="javascript"}
<script src="__STATIC__/home/js/order.js"></script>
<script>
    $(function () {
//        星星显示
        var exclusiveCount=parseInt($('.exclusive-count').html()) ;
        for(var i=1;i<=exclusiveCount;i++) {
            $('.xx span').eq(i-1).addClass('active');

        }
//        取消订单
        $('.cancellationOrder').picker({
            toolbarCloseText:'确认',
            title: "选择取消订单原因",
            cols: [
                {
                    textAlign: 'center',
                    values: ['不想买了', '商品质量问题','商品与信息不符','其他原因']
                }
            ]
        },function () {

        });

    });
</script>
{/block}